<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
	<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
	<title>登录</title>
	<link rel="icon" href="">
	<link rel="stylesheet" type="text/css" href="/static/css/aui.css" />
</head>
<body>
<!-- 头部 -->
	<header class="aui-bar aui-bar-nav" id="header" style="background-color: #00bcd4;padding-top: 10px;">
	    <div class="aui-title">登录</div>
	</header>
	<div id="header-bottom"></div>
    <section class="aui-content-padded">
	        <h2 class="aui-padded-t-15 aui-text-center"><b>登录你的账号</b></h2>
	        <div class="aui-content">
	            <div class="aui-content aui-margin-b-15">
			        <ul class="aui-list aui-form-list">
			        	<li class="aui-list-item">
			                <div class="aui-list-item-inner">
			                    <div class="aui-list-item-label">
			                        用户名
			                    </div>
			                    <div class="aui-list-item-input">
			                        <input type="text" placeholder="Name" id="userName">
			                    </div>
			                </div>
			            </li>
			            <li class="aui-list-item">
			                <div class="aui-list-item-inner">
			                    <div class="aui-list-item-label">
			                        密码
			                    </div>
			                    <div class="aui-list-item-input">
			                        <input type="password" placeholder="Password" id="password">
			                    </div>
			                    <!-- <div class="aui-list-item-label-icon">
			                        <i class="aui-iconfont aui-icon-display"></i>
			                    </div> -->
			                </div>
			            </li>
			            <li>
			            	<div><span id="result"></span></div>
			            </li>
			            <li class="aui-list-item">
			                <div class="aui-list-item-inner">
			                    <div class="aui-list-item-label">
			                        自动登录
			                    </div>
			                    <div class="aui-list-item-input">
			                        <input type="checkbox" class="aui-switch" checked="">
			                    </div>
			                </div>
			            </li>
			        </ul>
			    </div>
	        </div><!-- endcontent -->
	</section>
        <p><div class="aui-btn aui-btn-info aui-btn-block" style="width:70%;margin-left: 15%;background-color: #00bcd4 !important" onclick="ajax_request()">登录</div>
        </p>
        <div class="aui-content-padded aui-text-center">
        	<a href="{% url 'mycampus:forgotPassword' %}" class="aui-margin-r-5">忘记密码</a>
        	<a href="{% url 'mycampus:register' %}" class="aui-margin-l-5">注册账号</a>
        </div>
    

	<script type="text/javascript" src="/static/js/api.js"></script>
	<script type="text/javascript">
	    apiready = function(){
		        if(api.systemType == 'ios'){
		            scaleEnabled = true;
		            // document.getElementById('header').style.paddingTop = '10px';
		        }
                //支持沉浸式效果
		        if (!api.statusBarAppearance) {
		           document.getElementById('header').style.paddingTop = '0px';
		        }
	        };
	</script>
	      
<script>
	function ajax_request()
	{
	var xmlhttp;
	if (window.XMLHttpRequest) {
	    // code for IE7+, Firefox, Chrome, Opera, Safari
	    xmlhttp=new XMLHttpRequest();
	  } else {
	    // code for IE6, IE5
	    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	}

	xmlhttp.onreadystatechange=function() {
	  if (xmlhttp.readyState==4 && xmlhttp.status==200) {
	      // document.getElementById("result").innerHTML=xmlhttp.responseText;
	      if(xmlhttp.responseText==""){
	      	document.getElementById("result").innerHTML="";
	      	window.location.href="/mycampus/index"; 
	      }else{
	      	document.getElementById("result").innerHTML="<font color=\"red\">"+xmlhttp.responseText+"</font>";

	      }
	  }
	}

	var userName = document.getElementById("userName").value;
	var password = document.getElementById("password").value;
	xmlhttp.open("GET", "/mycampus/loginJudge?userName=" + userName + "&&password=" + password , true);
	xmlhttp.setRequestHeader("X-Requested-With", "XMLHttpRequest");
	xmlhttp.send();
	// ajax 教程：http://www.ziqiangxuetang.com/ajax/ajax-tutorial.html
	}
</script>  
</body>
</html>